/**
 * @description: RouteRecordRaw 参数说明
 * @param: path {string} 跳转路径
 * @param: redirect {string} 重定向跳转路径，无需配置，代码会自动生成默认重定向用户有权限的第一个路由
 * @param: component {string} 组件
 * @param: meta {object} 可以自定义一些内容
 *         visible {boolean} 一级菜单只有一个二级菜单时是否始终显示。（因为有的一级菜单只有一个二级菜单）
 *         hidden {Boolean} 默认false， 为true表示此路由不作为菜单展示
 *         hideAside {Boolean} 默认false， 为true表示隐藏左侧导航
 *         icon {string} 菜单对应的图标icon, 推荐使用svg形式
 *         title {string} 菜单对应的标题，也作为浏览器标签标题展示
 *         authCodes {array} 用户权限code
 *         operations {array} 当前页面组件用户有权限的操作的 code 列表
 *         isBlank {boolean} 默认false， 是否需要在浏览器新标签页中打开
 *         activeMenu {string} 激活菜单的index, index取的是路由中path的值, 解决有不在菜单中展示的页面时菜单激活指定菜单
 *
 *         setBreadcrumbs {function} 重置面包屑内容
 *         iframeSrc {string} 页面内嵌iframe的地址
 *         isPageReused {boolean} 默认false 如果两个路由使用同一个组件，一定要设置isPageReused: true
 *         keepAlive {boolean} 默认false，页面是否被缓，true为缓存页面
 * @return void {*}
 */
import { createRouter, createWebHistory } from 'vue-router';

import { homeRoutes } from './modules/home'; // 首页

import type { RouteRecordRaw, RouteLocationNormalized } from 'vue-router';

import config from '@/config';
import Layout from '@/layouts/index.vue';
import Redirect from '@/layouts/redirect/index.vue';
import { usePermissionStore } from '@/store/permission';
import { requestStore } from '@/store/request';
import { useUserStore } from '@/store/user';
import Page401 from '@/views/401.vue';
import Page404 from '@/views/404.vue';

const viteProjectRoot = import.meta.env.VITE_APP_ROOT;
const baseTitle = import.meta.env.VITE_APP_NAME_ZH;
let userStore: TypeObject;
let permissionStore: TypeObject;
let myRequestStore: TypeObject;

export const constantRoutes: Array<RouteRecordRaw> = [];

export const catchAllRoutes: Array<RouteRecordRaw> = [
  {
    path: '/redirect',
    component: Layout,
    name: 'Redirect',
    meta: {
      hidden: true,
    },
    children: [
      {
        path: '/redirect/:catchAll(.*)',
        component: Redirect,
      }
    ],
  },
  {
    path: '/error',
    name: 'Error',
    component: Layout,
    redirect: '/error/404',
    meta: {
      hidden: true,
    },
    children: [
      {
        path: '/error/404',
        name: '404',
        component: Page404,
        meta: {
          hidden: true,
        },
      },
      {
        path: '/error/401',
        name: '401',
        component: Page401,
        meta: {
          hidden: true,
          hideAside: true,
        },
      }
    ],
  }
];

export const asyncRoutes: Array<RouteRecordRaw> = [
  ...homeRoutes
];

const router = createRouter({
  history: createWebHistory(viteProjectRoot),
  routes: [...constantRoutes, ...catchAllRoutes],
  scrollBehavior: () => ({
    left: 0,
    top: 0,
  }),
});

router.beforeEach(async (to: RouteLocationNormalized, from: RouteLocationNormalized, next: Func) => {
  if (!userStore) {
    userStore = useUserStore();
  }
  if (!permissionStore) {
    permissionStore = usePermissionStore();
  }

  // 需要根据条件动态设置面包屑的时候可以在meta中设置setBreadcrumbs函数
  if (typeof to.meta.setBreadcrumbs === 'function') {
    to.meta.breadcrumbs = to.meta.setBreadcrumbs(to);
  }

  // 使用同一个页面组件的不同路由
  const isPageReused = from.meta.isPageReused && to.meta.isPageReused;
  const hasMenus = userStore.menus && userStore.menus.length > 0;
  if (hasMenus) {
    if (isPageReused) {
      next(`/redirect${to.fullPath}`);
    } else {
      next();
    }
  } else {
    const { authKeys } = await userStore.getUserInfo();
    const { accessedRoutes, permissionRoutes } = await permissionStore.generateRoutes(authKeys);
    console.log('根据用户权限动态生成的路由:', accessedRoutes);

    //  设置用户输入 / 跳转至有权限的第一个路由
    const firstRoute = permissionRoutes.filter(
      (item: RouteRecordRaw) => !config.excludePath.includes(item.path) && item.meta
    )[0];

    if (firstRoute) {
      accessedRoutes.unshift({
        path: '/',
        redirect: firstRoute.path,
        meta: {
          hidden: true,
          title: baseTitle,
        },
      });
    }

    // 动态添加路由
    await accessedRoutes.forEach((item: any) => {
      router.addRoute(item);
    });

    // 配置404
    router.addRoute({
      path: '/:catchAll(.*)',
      redirect: '/error/404',
      meta: {
        hidden: true,
      },
    });

    // 用户没有菜单权限 进入401 用户无权限页面
    if (!authKeys.length) {
      if (config.excludePath.includes(to.path)) {
        next();
        return;
      }
      next('/error/401');
      return;
    }

    next({ ...to, replace: true });
  }
});

router.afterEach((to: RouteLocationNormalized) => {
  setTimeout(() => {
    window.document.title = to.meta.title ? `${to.meta.title} | ${baseTitle}` : baseTitle;
  }, 0);
  if (!myRequestStore) {
    myRequestStore = requestStore();
  }
  // 页面切换清除所有的axios请求
  if (myRequestStore.requests && myRequestStore.requests.length > 0) {
    myRequestStore.requests.forEach((controller: any) => controller.abort()); // 通过遍历终止所有未完成的请求;
    myRequestStore.clearRequest();
  }
});

export default router;
